<template>
  <el-dialog :visible="dialogVisible"
             v-dialog-drag
             :before-close="beforeClose"
             :width="dialogWidth"
             :title="title"
             :destroy-on-close="true"
  >
    <modify ref="modify" :isPage="false" v-if="dialogVisible"></modify>
    <div slot="footer" class="dialog-footer">
      <el-button @click="cancelevent">取 消</el-button>
      <el-button type="primary" @click="()=>_successDialog()" :loading="loading">确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>


  import { deepClone } from '@/utils';

  export default {
    data() {
      return {
// region  弹出框
        dialogVisible: false,
        loading: false,
        title: '',
// endregion
        dialogWidth: '800px',
        options: {
          dialogWidth: '800px',
          success() {
          }, data() {
          },
        },
      };
    },
    watch: {
      dialogVisible(istrue) {
        if (!istrue) {
          this.reset();
          this.options && this.options.destroyed && this.options.destroyed();
        }
      },
    },
    components: {
      //modify: () => import('./modify'),
    },
    mounted() {
    },
    methods: {
      beforeClose() {
        this.dialogVisible = false;
      },

      init(options) {
        this.options = options;
        this.dialogVisible = true;
        if (this.options.dialogWidth) {
          this.dialogWidth = this.options.dialogWidth;
        }
        this.$nextTick(() => {
          setTimeout(() => {
            this.$refs['modify'].initByDialog(deepClone(options.data()));
          }, 100);
        });
      },
      reset() {
        this.loading = false;
      },


      // region  弹出框
      async _successDialog() {
        this.loading = true;
        var submitByDialog = this.$refs['modify'] &&
          this.$refs['modify'].submitByDialog &&
          this.$refs['modify'].submitByDialog;
        if (!submitByDialog) return false;
        var result = await submitByDialog();
        this.loading = false;
        if (result.success) {
          this.dialogVisible = false;
          this.$emit('success');
          this.options && this.options.success && this.options.success(result);
        } else {
          this.options && this.options.cancel && this.options.cancel();
        }
      },
      cancelevent() {
        this.dialogVisible = false;
        this.options && this.options.cancel && this.options.cancel();
      },
      // endregion
    },
  };
</script>
